<template>
	<div class="shangpinguanli">
    <left></left>
    <div class="right">
      <div style="height: 91px; border-bottom: 1px solid rgb(227, 232, 241); width: 100%; padding: 0 30px;" class="flexbc">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item>首页</el-breadcrumb-item>
        </el-breadcrumb>
        <top></top>
      </div>
      <div style="padding: 37px 30px 0 30px; height: calc(100vh - 91px); overflow: auto;">
        <div class="flexc" style="background: #fff; width: 790px; height: 50px; background: rgb(255, 255, 255); border-radius: 25px; padding: 15px 20px;">
          <div style="margin-right: 15px;"><img src="../../../static/img/index2.png" style="width: 18px;"></div>
          <div>开发中.</div>
        </div>
        <div class="flexc" style="background: #fff; background: rgb(255, 255, 255); border-radius: 25px; padding: 25px 20px; margin-top: 40px; width: 480px;">
          <div><img src="../../../static/img/shouye2.png" style="width: 50px;"></div>
          <div style="margin-left: 50px;"><el-button type="primary" plain round @click="go('/weixiaodian')">编辑微小店</el-button></div>
          <div style="margin-left: 20px;"><el-button type="primary" round @click="openw2()">进入微小店</el-button></div>
        </div>

        <div style="padding: 0px 0 19px 0; font-size: 18px; font-weight: 700; margin-top: 40px;" class="flex">
          <div><img src="../../../static/img/index1.png" style="width: 22px; margin-right: 10px;"></div>
          <div>实时数据</div>
        </div>
        <div class="flex">
          <div style="width: 295px; height: 160px; background: #fff; border-radius: 20px; padding: 20px; margin-right: 15px; margin-bottom: 15px;">
            <div style="color: rgb(120, 125, 133); font-size: 16px;">提交订单</div>
            <div class="flexbc" style="margin: 10px 0;">
              <div class="flex">
                <div style="font-size: 40px; margin-right: 10px;">{{all.allCount.count}}</div>
                <div style="position: relative; top: 15px;">
                  <div style="color: rgb(212, 215, 222); font-size: 12px; margin-bottom: 5px;">近3天</div>
                  <div style="color: rgb(252, 30, 53); font-size: 14px;"><span v-if="all.allCount.inc >= 0">+</span>{{all.allCount.inc}}</div>
                </div>
              </div>
              <div><img src="../../../static/img/index10.png" style="width: 60px;"></div>
            </div>
            <div style="color: rgb(64, 66, 71);">分销商<span style="margin-left: 10px;">{{count.data.amount}}</span></div>
          </div>
          <div style="width: 295px; height: 160px; background: #fff; border-radius: 20px; padding: 20px; margin-right: 15px; margin-bottom: 15px;">
            <div style="color: rgb(120, 125, 133); font-size: 16px;">审核通过</div>
            <div class="flexbc" style="margin: 10px 0;">
              <div class="flex">
                <div style="font-size: 40px; margin-right: 20px;">{{all.passCount.count}}</div>
                <div style="position: relative; top: 15px;">
                  <div style="color: rgb(212, 215, 222); font-size: 12px; margin-bottom: 5px;">近3天</div>
                  <div style="color: rgb(252, 30, 53); font-size: 14px;"><span v-if="all.passCount.inc >= 0">+</span>{{all.passCount.inc}}</div>
                </div>
              </div>
              <div><img src="../../../static/img/index9.png" style="width: 60px;"></div>
            </div>
            <div style="color: rgb(64, 66, 71);">分销商<span style="margin-left: 10px;">{{count.data.deliver_amount}}</span></div>
          </div>
          <div style="width: 295px; height: 160px; background: #fff; border-radius: 20px; padding: 20px; margin-right: 15px; margin-bottom: 15px;">
            <div style="color: rgb(120, 125, 133); font-size: 16px;">生产发货</div>
            <div class="flexbc" style="margin: 10px 0;">
              <div class="flex">
                <div style="font-size: 40px; margin-right: 10px;">{{all.produceCount.count}}</div>
                <div style="position: relative; top: 15px;">
                  <div style="color: rgb(212, 215, 222); font-size: 12px; margin-bottom: 5px;">近3天</div>
                  <div style="color: rgb(252, 30, 53); font-size: 14px;"><span v-if="all.produceCount.inc >= 0">+</span>{{all.produceCount.inc}}</div>
                </div>
              </div>
              <div><img src="../../../static/img/index8.png" style="width: 60px;"></div>
            </div>
            <div style="color: rgb(64, 66, 71);">分销商<span style="margin-left: 10px;">{{count.data.opening_card_amount}}</span></div>
          </div>
          <div style="width: 295px; height: 160px; background: #fff; border-radius: 20px; padding: 20px; margin-right: 15px; margin-bottom: 15px;">
            <div style="color: rgb(120, 125, 133); font-size: 16px;">生产失败</div>
            <div class="flexbc" style="margin: 10px 0;">
              <div class="flex">
                <div style="font-size: 40px; margin-right: 10px;">{{all.failCount.count}}</div>
                <div style="position: relative; top: 15px;">
                  <div style="color: rgb(212, 215, 222); font-size: 12px; margin-bottom: 5px;">近3天</div>
                  <div style="color: rgb(252, 30, 53); font-size: 14px;"><span v-if="all.failCount.inc >= 0">+</span>{{all.failCount.inc}}</div>
                </div>
              </div>
              <div><img src="../../../static/img/index7.png" style="width: 60px;"></div>
            </div>
            <div style="color: rgb(64, 66, 71);">分销商<span style="margin-left: 10px;">{{count.data.fail_amount}}</span></div>
          </div>
          <div style="width: 295px; height: 160px; background: #fff; border-radius: 20px; padding: 20px; margin-bottom: 15px;">
            <div style="color: rgb(120, 125, 133); font-size: 16px;">直属分销商</div>
            <div class="flexbc" style="margin: 10px 0;">
              <div class="flex">
                <div style="font-size: 40px; margin-right: 10px;">{{count.direct_count}}</div>
                <!-- <div style="position: relative; top: 15px;">
                  <div style="color: rgb(212, 215, 222); font-size: 12px; margin-bottom: 5px;">近3天</div>
                  <div style="color: rgb(252, 30, 53); font-size: 14px;">+100</div>
                </div> -->
              </div>
              <div><img src="../../../static/img/index6.png" style="width: 60px;"></div>
            </div>
            <div style="color: rgb(64, 66, 71);">所有分销商<span style="margin-left: 10px;">{{count.count}}</span></div>
          </div>
        </div>

        <div class="flex" style="margin-top: 0px;">
          <div style="margin-right: 20px; ">
            <div style="padding: 0px 0 19px 0; font-size: 18px; font-weight: 700; margin-top: 40px;" class="flex">
              <div><img src="../../../static/img/index3.png" style="width: 22px; margin-right: 10px;"></div>
              <div>最近一周订单统计</div>
            </div>
            <div style="width: 660px; height: 400px; background: rgb(255, 255, 255); border-radius: 20px;">
              <tu></tu>
            </div>
          </div>
          <div style="margin-right: 20px;">
            <div style="padding: 0px 0 19px 0; font-size: 18px; font-weight: 700; margin-top: 40px;" class="flex">
              <div><img src="../../../static/img/index4.png" style="width: 22px; margin-right: 10px;"></div>
              <div>推广商城监控</div>
            </div>
            <div style="width: 370px; height: 400px; background: rgb(255, 255, 255); border-radius: 20px; padding: 20px;">
              <div style="padding: 20px; background: rgb(246, 248, 251); border: 1px solid rgb(227, 232, 241); border-radius: 10px; margin-bottom: 20px;">
                <div class="flexbc" style="margin: 10px 0;">
                  <div>
                    <div style="font-size: 20px; margin-right: 10px;">测试数据</div>
                    <div style="font-size: 16px; margin: 10px 15px 20px 0;">单链接访客数</div>
                    <div style="color: rgb(120, 125, 133); font-size: 14px;">浏览量<span style="margin-left: 10px;">测试数据</span></div>
                  </div>
                  <div><img src="../../../static/img/index7.png" style="width: 60px;"></div>
                </div>
              </div>
              <div style="padding: 20px; background: rgb(246, 248, 251); border: 1px solid rgb(227, 232, 241); border-radius: 10px;">
                <div class="flexbc" style="margin: 10px 0;">
                  <div>
                    <div style="font-size: 20px; margin-right: 10px;">测试数据</div>
                    <div style="font-size: 16px; margin: 10px 15px 20px 0;">多商品访客数</div>
                    <div style="color: rgb(120, 125, 133); font-size: 14px;">浏览量<span style="margin-left: 10px;">测试数据</span></div>
                  </div>
                  <div><img src="../../../static/img/index7.png" style="width: 60px;"></div>
                </div>
              </div>
            </div>
          </div>
          <div>
            <div style="padding: 0px 0 19px 0; font-size: 18px; font-weight: 700; margin-top: 40px;" class="flex">
              <div><img src="../../../static/img/index5.png" style="width: 22px; margin-right: 10px;"></div>
              <div>系统更新日记</div>
            </div>
            <div style="width: 470px; height: 400px; background: rgb(255, 255, 255); border-radius: 20px; padding: 20px;">
              <div style="padding: 20px; background: rgb(246, 248, 251); border: 1px solid rgb(227, 232, 241); border-radius: 10px; margin-bottom: 20px;">
                <div class="flexbc">
                  <div class="flex">
                    <div><img src="../../../static/img/index11.png" style="width: 20px;"/></div>
                    <div style="color: rgb(0, 90, 255); margin-left: 10px;">V4.3.2</div>
                  </div>
                  <div style="color: rgb(175, 179, 188); font-size: 12px;">2022-09-16 15:33:21</div>
                </div>
                <div class="flexbc" style="padding: 10px 0;">
                  <div style="color: rgb(2, 12, 29);">测试数据</div>
                  <div style="color: rgb(120, 125, 133);">></div>
                </div>
              </div>
              <div style="padding: 20px; background: rgb(246, 248, 251); border: 1px solid rgb(227, 232, 241); border-radius: 10px; margin-bottom: 20px;">
                <div class="flexbc">
                  <div class="flex">
                    <div><img src="../../../static/img/index11.png" style="width: 20px;"/></div>
                    <div style="color: rgb(0, 90, 255); margin-left: 10px;">V4.3.2</div>
                  </div>
                  <div style="color: rgb(175, 179, 188); font-size: 12px;">2022-09-16 15:33:21</div>
                </div>
                <div class="flexbc" style="padding: 10px 0;">
                  <div style="color: rgb(2, 12, 29);">测试数据</div>
                  <div style="color: rgb(120, 125, 133);">></div>
                </div>
              </div>
              <div style="padding: 20px; background: rgb(246, 248, 251); border: 1px solid rgb(227, 232, 241); border-radius: 10px; margin-bottom: 20px;">
                <div class="flexbc">
                  <div class="flex">
                    <div><img src="../../../static/img/index11.png" style="width: 20px;"/></div>
                    <div style="color: rgb(0, 90, 255); margin-left: 10px;">V4.3.2</div>
                  </div>
                  <div style="color: rgb(175, 179, 188); font-size: 12px;">2022-09-16 15:33:21</div>
                </div>
                <div class="flexbc" style="padding: 10px 0;">
                  <div style="color: rgb(2, 12, 29);">测试数据</div>
                  <div style="color: rgb(120, 125, 133);">></div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <footers></footers>
      </div>
    </div>
	</div>
</template>

<script>
  import left from '../left.vue'
  import top from '../top.vue'
  import footers from '../footer.vue'
  import tu from './dialog/yizhou.vue'
	export default {
		name: 'shangpinguanli',
    components:{
      left,tu,top,footers
    },
		data() {
			return {
        all:{
          allCount:"",
          passCount:"",
          produceCount:"",
          failCount:""
        },
        count:{
          count:"",
          data:""
        },
        yizhou:""
			}
		},
		created() {
      this.getinfo()
      console.log(this.$router)
		},
		mounted() {

		},
		methods: {
      openw2:function(item){
        let url = location.origin + '/h5'
        // let url = location.origin + '/h5/order?shop_id=' + JSON.parse(localStorage.getItem('user')).id + '&id=' + item.id
        this.openw(url)
      },
      getinfo:function(){
        axios.get('/own/order/count').then((response)=>{
        	if (response.data.msg.code == 0) {
            this.all = response.data.data.data
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })

        axios.get('/own/agent/count').then((response)=>{
        	if (response.data.msg.code == 0) {
            this.count = response.data.data
        	} else {
        		this.$message.error(response.data.msg.info);
        	}
        })



      }
		}
	}
</script>


<style scoped lang="less">

</style>
